.fade-enter-active,
.fade-leave-active {
  transition: opacity 0.5s ease;
}

.fade-enter-from,
.fade-leave-to {
  opacity: 0;
}
:root {
  // css 变量 :root 与var
  --animate-duration: 800ms;
  --animate-delay: 0.9s;
  --color: red; // 如果不加 -- 就是全局
}
#animate-index {
  // span {
  //   color: var(--color);
  // }
  #video{
    width: 300px;
  }
  .img{
    width: 300px;
     margin-left: 10px;
  }
  .green {
    color: var(--green);
    // vue里的css变量 (class id 选择器 比如 color:var(--green)编译
    // style里面注册样式 比如 style:{'--green':'green'}
  }
  .my-element {
    display: inline-block;
    margin: 0 0.5rem;

    animation: bounce; /* referring directly to the animation's @keyframe declaration */
    animation-duration: 2s; /* don't forget to set a duration! */
  }
  .animate__animated.animate__bounce {
    --animate-duration: var(--animate-delay);
  }
}